import Vue from 'vue';
import Loading from './src/main.vue';

const loadinghtm = Vue.extend(Loading);
const loadingDirective = {};

loadingDirective.install = Vue => {
	Vue.directive('tloading', {
	  	bind: function (el, binding, vnode) {
	  		const loading = new loadinghtm({
				el: document.createElement('div')
			});
			el.instance = loading;
			el.loading = loading.$el;
			if(binding.value===true) {
				el.style.position="relative"
				el.appendChild(el.loading)
			}else{
				el.loading.remove()
			}
	    },
	    update: function (el, binding, vnode) {
			if(binding.value===true) {
				el.style.position="relative"
				el.appendChild(el.loading)
			} else {
				el.loading.remove()
			}
	    }
	});
}

export default loadingDirective;